<template>
	<component :is="currentForm" ref="flowFormRef" :record="formData" :disabled="disabled" />
</template>
<script setup name="formDetail">
	import sysFlowConfigApi from '@/api/flow/sysFlowConfigApi'

	const props = defineProps({
		data: {
			type: Object,
			required: false
		}
	})
	const flowFormRef = ref()
	const currentForm = shallowRef()
	const disabled = ref(true)
	const formData = ref({
		dataJson: '',
		flowId: '',
		draftId: '',
		formRouter: ''
	})

	// 打开抽屉
	const init = () => {
		sysFlowConfigApi.sysFlowConfigDetail({ id: props.data.flowId }).then((res) => {
			formData.value.dataJson = props.data.dataJson ? JSON.parse(props.data.dataJson) : {}
			if (res.formType == '2') {
				loadComponent(res.formRouter)
			}
		})
	}
	init()
	/**
	 * 动态组件
	 */
	const loadComponent = async (component) => {
		currentForm.value = await defineAsyncComponent(() =>
			import(/* @vite-ignore */ `../../../../flow/dtform/component/${component}.vue`)
		)
	}
</script>
